import React from 'react'
import Preview from '../preview/preview'
import Answer from './answer'

export default class DetailList extends React.Component {
  static propTypes = {
    detailGet: React.PropTypes.func,
    push: React.PropTypes.func,
    question: React.PropTypes.object,
    answerIds: React.PropTypes.array,
    answers: React.PropTypes.object,
    params: React.PropTypes.object
  }
  componentDidMount() {
    const {params: {id}} = this.props
    console.log('id', id)
    this.props.detailGet(id)
  }

  getAnserList() {
    const {answerIds, answers} = this.props
    if (answerIds && answerIds.length > 0) {
      return answerIds.map(id => <Answer {...this.props} key={id} answer={answers[id]} />)
    }
  }

  render() {
    const {question: item} = this.props
    if (item === undefined) {
      return (<div />)
    }
    return (
      <div>
        <Preview {...item} key={item.id} push={this.props.push} />
        {this.getAnserList()}
      </div>
    )
  }
}
